<div class="crayons-card notification">
  <% json_data = notification.json_data %>
  <% cache "activity-profile-pic-#{json_data['user']['id']}-#{json_data['user']['profile_image_90']}" do %>
    <%= render "notifications/shared/profile_pic", json_data: json_data %>
  <% end %>

  <div class="notification__content">
    <% if notification.json_data["article"] %>
      <header class="mb-4">
        <h2 class="fs-base fw-normal">
          <%= message_user_acted_maybe_org(json_data, "views.notifications.mention.article_html", if_org: "views.notifications.mention.if_org_html") %>
        </h2>
        <p class="lh-tight"><small class="fs-s color-base-60"><%= time_ago_in_words json_data["article"]["published_at"], scope: :"datetime.distance_in_words_ago" %></small></p>
      </header>

      <%= render "notifications/shared/article_preview", notification: notification, context: "default" %>
    <% elsif notification.json_data["comment"] %>
      <h2 class="fs-base fw-normal mb-4">
        <%= message_user_acted_maybe_org(json_data, "views.notifications.mention.comment_html") %>
      </h2>
      <%= render "notifications/shared/comment_box", json_data: json_data, notification: notification, context: "default" %>
    <% end %>
  </div>
</div>
